<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>TrafMon</title>
        <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true">
        </script>
        <script type="application/x-javascript" src="utils.js">
        </script>
        <script type="text/javascript" src="trafmon.js">
        </script>
        <link rel="stylesheet" href="desktop.css" type="text/css" />
    </head>
    <body onload="trafmon.desktopInit();">
        <img src="images/logo.png" alt="trafmon" />
        <table id="menu">
            <tr>
                <td class="nav">
                    Desktop Version | <a href="#" onclick="alert('The iPhone version will almost definitely NOT work in desktop browsers!');window.location='iphone.html';">iPhone version</a>
                    | <a href="ss.html">iPhone Screenshots</a>
                </td>
            </tr>
        </table>
        <table id="options">
            <tr>
                <td class="optionlabel" colspan="2">
                    Control Panel
                </td>
                <td colspan=2 style="text-align:right;">
                    <input type="button" name="reset" value="Reset Map" id="reset" onclick="trafmon.desktopInit();"/>
                </td>
            </tr>
            <tr>
                <td class="optionlabel">
                    Show:
                </td>
                <td>
                    <input type="checkbox" name="show_cars" value="true" id="show_cars" checked="checked" onclick="trafmon.toggleShowCars(true);"/>
                    <label for="show_cars">
                        Cars
                    </label>
                    &nbsp;<input type="checkbox" name="show_public" value="true" id="show_public" checked="checked" onclick="trafmon.toggleShowPub(true);"/>
                    <label for="show_public">
                        Public Transport
                    </label>
                </td>
                <td class="optionlabel">
                    Traffic Times:
                </td>
                <td>
                    <select name="day" onchange="trafmon.setDayOptDesktop();" id="day">
                        <option value="0" selected="selected">Live Traffic</option>
                        <option value="2">Monday</option>
                        <option value="3">Tuesday</option>
                        <option value="4">Wednesday</option>
                        <option value="5">Thursday</option>
                        <option value="6">Friday</option>
                        <option value="7">Saturday</option>
                        <option value="1">Sunday</option>
                    </select>
                    &nbsp;
                    <select name="timerange" id="timerange" onchange="trafmon.setTimeOptDesktop();" disabled="true">
                        <option value="-1" selected="selected">(Select Time Range)</option>
                        <option value="0">Early Morning (12 AM - 6 AM)</option>
                        <option value="1">Morning Peak (6 AM - 9 AM)</option>
                        <option value="2">Daytime (9 AM - 4:30 PM)</option>
                        <option value="3">Afternoon Peak (4:30 PM - 7 PM)</option>
                        <option value="4">Evening (7 PM - 12 AM)</option>
                    </select>
                </td>
            </tr>
        </table>
        <div id="map_canvas">
        </div>

        <!-- THIS CODE IS FOR TESTING PURPOSES
        <div id="debug">
        </div>
        <p>
        <a href="./SnoopServlet">Here is the page that reports your browser!</a>
        </p>
        <p>
        <a href="./Db4oServlet">Here is the page that does db stuff</a>
        </p>
        <p>
        <a href="./Db4oServlet">COPY Here is the page that does db stuff</a>
        </p>
        <form name="input" method="post" action="./DataPointServlet">
        maxLat: <input type="text" name="maxLat" /><br/>
        maxLng: <input type="text" name="maxLng" /><br/>
        minLat: <input type="text" name="minLat" /><br/>
        minLng: <input type="text" name="minLng" /><br/>
        <input type="submit" value="Fetch points in specified area"/></form>
        <br/><br/>
        <form name="input" method="post" action="./DataPointServlet">
        Lat: <input type="text" name="lat" /><br/>
        Lng: <input type="text" name="lng" /><br/>
        Bearing: <input type="text" name="bearing" /><br/>
        Speed: <input type="text" name="speed" /><br/>
        Tag: <input type="text" name="tag" /><br/>
        <input type="submit" value="Submit Point"/></form>
        <p>
        <a href="./SimpleTestServlet">Simple Test Servlet</a>
        </p>
        -->
    </body>
</html>
